var canvas = document.getElementById("myCanvas01");
var ctx = canvas.getContext("2d");

var centerX = canvas.width / 2; // 中心点的 x 坐标
var centerY = canvas.height / 2; // 中心点的 y 坐标
var radius = 100; // 圆的半径
var startAngle = ((180 - 90 + 130) * Math.PI) / 180; // 起始角度转换为弧度
var endAngle = ((180 - 295) * Math.PI) / 180; // 结束角度转换为弧度

ctx.beginPath();
ctx.moveTo(centerX, centerY);
ctx.arc(centerX, centerY, radius, startAngle, endAngle, false); // 注意最后的参数为 true，表示绘制顺时针方向的扇形
ctx.closePath();
ctx.fillStyle = "blue";
ctx.fill();


var canvas = document.getElementById("myCanvas02");
var ctx = canvas.getContext("2d");

var centerX = canvas.width / 2; // 中心点的 x 坐标
var centerY = canvas.height / 2; // 中心点的 y 坐标
var radius = 100; // 圆的半径
var startAngle = ((180 - 90 + 155) * Math.PI) / 180; // 起始角度转换为弧度
var endAngle = ((180 - 160) * Math.PI) / 180; // 结束角度转换为弧度

ctx.beginPath();
ctx.moveTo(centerX, centerY);
ctx.arc(centerX, centerY, radius, startAngle, endAngle, false); // 注意最后的参数为 true，表示绘制顺时针方向的扇形
ctx.closePath();
ctx.fillStyle = "green";
ctx.fill();


var canvas = document.getElementById("myCanvas03");
var ctx = canvas.getContext("2d");

var centerX = canvas.width / 2; // 中心点的 x 坐标
var centerY = canvas.height / 2; // 中心点的 y 坐标
var radius = 100; // 圆的半径
var startAngle = ((180 - 90 + 290) * Math.PI) / 180; // 起始角度转换为弧度
var endAngle = ((180 - 70) * Math.PI) / 180; // 结束角度转换为弧度

ctx.beginPath();
ctx.moveTo(centerX, centerY);
ctx.arc(centerX, centerY, radius, startAngle, endAngle, false); // 注意最后的参数为 true，表示绘制顺时针方向的扇形
ctx.closePath();
ctx.fillStyle = "yellow";
ctx.fill();



var canvas = document.getElementById("myCanvas04");
var ctx = canvas.getContext("2d");

var centerX = canvas.width / 2; // 中心点的 x 坐标
var centerY = canvas.height / 2; // 中心点的 y 坐标
var radius = 100; // 圆的半径
var startAngle = ((180 - 90 + 380) * Math.PI) / 180; // 起始角度转换为弧度
var endAngle = ((185) * Math.PI) / 180; // 结束角度转换为弧度

ctx.beginPath();
ctx.moveTo(centerX, centerY);
ctx.arc(centerX, centerY, radius, startAngle, endAngle, false); // 注意最后的参数为 true，表示绘制顺时针方向的扇形
ctx.closePath();
ctx.fillStyle = "red";
ctx.fill();


var canvas = document.getElementById("myCanvas05");
var ctx = canvas.getContext("2d");

var centerX = canvas.width / 2; // 中心点的 x 坐标
var centerY = canvas.height / 2; // 中心点的 y 坐标
var radius = 100; // 圆的半径
var startAngle = ((180 - 90 + 455) * Math.PI) / 180; // 起始角度转换为弧度
var endAngle = ((220) * Math.PI) / 180; // 结束角度转换为弧度

ctx.beginPath();
ctx.moveTo(centerX, centerY);
ctx.arc(centerX, centerY, radius, startAngle, endAngle, false); // 注意最后的参数为 true，表示绘制顺时针方向的扇形
ctx.closePath();
ctx.fillStyle = "purple";
ctx.fill();